<template>
  <view class="container">
    <!-- 可转余额显示 -->
    <view class="balance-box">
      <text class="balance-title">可转余额</text>
      <text class="balance-amount">{{ agentInfo.money }}</text>
    </view>
    <!-- 转账金额 -->
    <view class="form-item">
      <text class="form-label">* 转豆金额：</text>
      <input
        class="input"
        type="text"
        placeholder="请输入转豆金额"
        v-model="amount"
      />
    </view>

    <!-- 提交按钮 -->
    <button class="submit-btn" @click="submitTransfer">确认提交</button>

    <!-- 注意事项 -->
    <view class="note">
      <text class="note-title">注意事项：</text>
	  <!--
      <text class="note-content">
        1. 奖金转蜜豆时需扣除5%手续费，蜜豆实际到账95%。
      </text>
	  -->
	  <text class="note-content">
	  	1. 转换不可逆，无法再从蜜豆转回奖金，请仔细确认。
	  </text>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
		agentInfo:{},
      balance: 0, // 可转余额
      transferTargets: ["账户A", "账户B", "账户C"], // 转账对象列表
      selectedTarget: "", // 选中的转账对象
      amount: "", // 转账金额
    };
  },
  onShow() {
  	/*获取个人中心数据*/
  	this.init();
  },
  methods: {
	  init(){
	  	let self = this;
	  	self._get('user.agent/getUserSameNumber', {}, function(data) {
	  		console.info(data)
	  		self.agentInfo = data.data.agentInfo;
	  	});
	  },
    submitTransfer() {
      if (!this.amount) {
        uni.showToast({
          title: "请填写完整信息",
          icon: "none",
        });
        return;
      }
      if (Number(this.amount) > Number(this.agentInfo.money)) {
        uni.showToast({
          title: "余额不足",
          icon: "none",
        });
        return;
      }
	  let self = this;
	  self._post('user.agent/money_swap_beans', {money:self.amount},
	  	function(res) {
	  			console.info(res)
	  		uni.hideLoading()
			self.showSuccess(res.msg, () => {
				self.init();
			});
	  	},
	  	function() {
	  	}
	  );
    },
  },
};
</script>

<style>
.container {
  padding: 20rpx;
  background-color: #f7f7f7;
  height: 100vh;
}

/* 可转余额 */
.balance-box {
  background: linear-gradient(to right, #ff7f50, #ff4500);
  padding: 80rpx;
  border-radius: 10rpx;
  text-align: center;
  color: #fff;
  margin-bottom: 40rpx;
}
.balance-title {
  font-size: 30rpx;
  display: block;
}
.balance-amount {
  font-size: 60rpx;
  font-weight: bold;
  margin-top: 20rpx;
}

/* 表单项 */
.form-item {
  display: flex;
  flex-direction: column;
  margin-bottom: 30rpx;
}
.form-label {
  font-size: 28rpx;
  margin-bottom: 10rpx;
}
.picker,
.input {
  border: 1rpx solid #ddd;
  padding: 20rpx;
  border-radius: 8rpx;
  background-color: #fff;
}

/* 按钮 */
.submit-btn {
  background-color: #ff4500;
  color: #fff;
  font-size: 32rpx;
  text-align: center;
  border-radius: 70rpx;
  padding: 20rpx;
}

/* 注意事项 */
.note {
  margin-top: 40rpx;
  font-size: 24rpx;
  color: #666;
}
.note-title {
  display: block;
  font-weight: bold;
  margin-bottom: 10rpx;
}
.note-content {
  white-space: pre-wrap;
  display: block;
}
</style>
